@import './base.less';

body {
  background-color: #f5f5f5;
  padding-bottom: 10.5333vw;
  //  padding-top: 5.3333vw;;
  height: 100%;

}

.yincnag {
  width: 100%;
  height: 100px;
  background-color: pink;
  position: relative;
  left: 0;
  right: 0;

}

.header {

  display: flex;
  justify-content: center;
  align-items: center;
  // height: 5.3333vw;
  height: 11.7333vw;
  background-color: #fff;

  .title {
    position: relative;
    // position: fixed;
    width: 100%;
    // left: 0;
    // top: 1.8667vw;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 81.3333vw;
    height: 8vw;
    background-color: #fff;

    span {
      position: absolute;
      left: -6.6667vw;
      top: 1.3333vw;
      font-size: 5.6vw;
      // left: -25px;
      // top: 6px;
      // font-size: 21px;
    }

    h3 {
      font-size: 4.2667vw;
    }


  }




}

.swiper {
  // position: relative;
  width: 100vw;
  // height: 64vw;
  height: 100vw;
  background-color: #f5f5f5;
  --swiper-navigation-size: 0;

  // .lunboxianshi {
  //   position: relative;
  //   right: 0;
  //   top: 0;
  //   background-color: red;
  //   width: 20px;
  //   height: 20px;
  // }
  .swiper-button-next {
    background-color: rgba(149, 149, 149, 0.6);
    color: #fff;
    position: relative;
    // top: -56px;
    // right: -316px;
    // width: 50px;
    // height: 20px;
    // line-height: 20px;
    // border-radius: 10px;

    top: -14.9333vw;
    right: -84.2667vw;
    width: 13.3333vw;
    height: 5.3333vw;
    line-height: 5.3333vw;
    border-radius: 2.6667vw;

  }

  img {
    // position: relative;
    // left: 19.6vw;
    // top: 0.1333vw;
    // width: 64vw;
    // width: 100vw;
    width: 100%;
    // height: 64vw;
    // height: 100vw;
    height: 100%;
  }
}






.lan {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 18.6667vw;
  width: 100vw;
  background-color: #fff;

  .pic {
    width: 93.6vw;
    height: 4vw;
    // background-color: aqua;
    margin-bottom: 2vw;

    span {
      color: #959595;
      font-size: 2.5333vw;

      &:nth-child(3) {
        float: right;
      }

      &:nth-child(2) {
        text-decoration: line-through;
      }

      &:nth-child(1) {
        color: #fa2209;
        font-size: 4.1333vw;
      }

      i {
        font-size: 2.5333vw;
      }
    }
  }

  .pic2 {
    width: 92.9333vw;
    height: 7.8667vw;

    // background-color: brown;
    p {
      font-size: 2.9333vw;
      color: #303330;
    }
  }
}

.guanggao {
  display: flex;
  // flex-direction: column;
  align-items: center;
  height: 9.2vw;
  background-color: #f5f5f5;

  span {
    margin-left: 1.3333vw;
    font-size: 2.5333vw;
    color: #fa2209;

    i {
      color: #303133;
      font-size: 2.5333vw;
    }
  }
}

.shangpin {
  display: flex;
  justify-content: space-between;
  align-items: center;
  // width: 93.3333vw;
  height: 3.6vw;
  background-color: #fff;
  margin-bottom: 1.3333vw;

  span {
    margin-left: 2vw;
    font-size: 2.2667vw;
    color: #999;

  }

  .one {
    font-size: 2.6667vw;
    color: #303133;
  }

  .icon-dayufuhao {
    margin-left: 0;
    margin-right: 2vw;
  }
}

.box {
  position: relative;
  background-color: #fff;

  .box1 {
    display: flex;
    padding-top: 2vw;

    // width: 94.1333vw;
    height: 17.7333vw;
    background-color: #fff;
    // margin-left: 2.9333vw;
    padding-left: 2.933vw;
    box-sizing: border-box;

    img {
      width: 4.9333vw;
      height: 4.9333vw;
      margin-right: 1.3333vw;
    }

    p {
      color: #303133;
      font-size: 2.2667vw;
      margin-right: 1.3333vw;
      padding-top: 1.3333vw;
    }

    span {
      padding-top: 0.8vw;
      font-size: 3.0667vw;
      color: orange;
    }
  }

  .box2 {
    position: absolute;
    left: 2.4vw;
    bottom: 2.2vw;

    p {
      padding-top: 1.3333vw;
      font-size: 2.5333vw;
      color: #333;

      &:nth-child(2) {
        font-size: 2.2667vw;
        color: #999;
      }
    }
  }
}

.miaoshu {
  margin-top: 1.3333vw;
  display: flex;
  align-items: center;
  height: 8.6667vw;
  background-color: #fff;

  h3 {
    margin-left: 2.6667vw;
    font-size: 2.6667vw;
    color: #303133;
  }
}

.tupian {
  width: 55.2vw;
  // height: 14.6667vw;
  // position: relative;
  // left: 0;

}

.tupian1 {
  width: 55.2vw;
  height: 44.1333vw;
}

.tupian2 {
  width: 55.2vw;
  height: 56.1333vw;
}

.footer {
  display: flex;
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 10.5333vw;
  background-color: #fff;

  .left {
    width: 21.2vw;
    height: 10.5333vw;

    // background-color: aqua;
    ul {
      display: flex;
      // align-items: center;
      width: 21.2vw;
      height: 10.5333vw;

      li {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 50%;
        height: 10.5333vw;

        span {
          font-size: 4.2667vw;
          margin-bottom: 0.9333vw;

        }

        p {
          font-size: 2.1333vw;
          color: #303133;
        }
      }
    }
  }

  .right {
    display: flex;
    align-items: center;
    width: 77.7333vw;
    height: 10.5333vw;

    a {
      color: #fff;
    }

    // background-color: #fa2209;
    .hezi {
      margin-top: 1.3333vw;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 37.3333vw;
      height: 7.0667vw;
      background: linear-gradient(90deg, #ffa600, #fb0);
      border-radius: 7.6vw;


    }

    .hezi2 {
      margin-left: 2vw;
      margin-top: 1.3333vw;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 37.3333vw;
      height: 7.0667vw;
      background: linear-gradient(90deg, #f9211c, #ff6335);
      border-radius: 7.6vw;


    }
  }
}